const sm = document.getElementById("shuming");
const zz = document.getElementById("zuozhe");
const year = document.getElementById("year");
const tjsj = document.getElementById("tianjiabook");
const list = document.getElementById("sousuolist");
const sssr = document.getElementById("search");
const ss = document.getElementById("sousuo");
let idCounter = 0;
const books = [];
let isEditing = false;

tjsj.addEventListener('click', function () {
    const ssm = sm.value;
    const zzm = zz.value;
    const cbnf = year.value;
    if (ssm && zzm && cbnf) {
        const book = {
            id: idCounter++,
            title: ssm,
            author: zzm,
            year: cbnf
        };
        books.push(book);
        const bookdiv = document.createElement('div');
        bookdiv.classList.add('bookbox');
        bookdiv.innerHTML = `
                <p>书名：<span class="smm">${ssm}</span></p>
                <p>作者：<span class="zmm">${zzm}</span></p>
                <p>出版年份：<span class="rqm">${cbnf}</span></p>
                <button class="bianji" onclick="bianjigongneng(${book.id})">编辑</button>
                <button class="shanchu" onclick="shanchugongneng(${book.id})">删除</button>`;
        bookdiv.id = `book-${book.id}`;
        list.appendChild(bookdiv);
        sm.value = '';
        zz.value = '';
        year.value = '';
    }
});

ss.addEventListener('click', function () {
    const word = sssr.value.toLowerCase();
    const fbooks = books.filter(book => {
        return book.title.toLowerCase().includes(word) || book.author.toLowerCase().includes(word);
    });
    list.innerHTML = '';
    fbooks.forEach(book => {
        const bookdiv = document.createElement('div');
        bookdiv.innerHTML = `
                <p>书名：<span class="smm">${book.title}</span></p>
                <p>作者：<span class="zmm">${book.author}</span></p>
                <p>出版年份：<span class="rqm">${book.year}</span></p>
                <button class="bianji" onclick="bianjigongneng(${book.id})">编辑</button> 
                <button class="shanchu" onclick="shanchugongneng(${book.id})">删除</button>`;
        bookdiv.id = `book-${book.id}`;
        list.appendChild(bookdiv);
    });
});

function bianjigongneng(id) {
    if (isEditing) {
        alert("请先完成当前编辑！");
        return;
    }
    const bjcd = document.getElementById("bianjits");
    const xsm = document.getElementById("xsm");
    const xzzm = document.getElementById("xzzm");
    const xcbnf = document.getElementById("xcbnf");
    const bc = document.getElementById("baocun");
    bjcd.style.display = "block";
    isEditing = true;
    const book = books.find(b => b.id === id);
    xsm.value = book.title;
    xzzm.value = book.author;
    xcbnf.value = book.year;

    const saveHandler = function () {
        book.title = xsm.value;
        book.author = xzzm.value;
        book.year = xcbnf.value;
        const bookDiv = document.getElementById(`book-${id}`);
        const zid1 = bookDiv.querySelector('.smm');
        const zid2 = bookDiv.querySelector('.zmm');
        const zid3 = bookDiv.querySelector('.rqm');
        if (zid1) zid1.textContent = book.title;
        if (zid2) zid2.textContent = book.author;
        if (zid3) zid3.textContent = book.year;
        bjcd.style.display = "none";
        isEditing = false;
        bc.removeEventListener('click', saveHandler);
    };

    bc.addEventListener('click', saveHandler);
}

function shanchugongneng(id) {
    if (isEditing) {
        alert("请先完成当前编辑！");
        return;
    }
    const index = books.findIndex(b => b.id === id);
    if (index !== -1) {
        books.splice(index, 1);
        const bookDiv = document.getElementById(`book-${id}`);
        bookDiv.remove();
    }
}